<!DOCTYPE html>
<html lang="zh">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="renderer" content="webkit">
    <!-- 避免IE使用兼容模式 -->
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>树表格</title>
    <script type="text/javascript" src="./../../../static/js/include/_include-css.js"></script>
</head>

<body class="bg-gray">
    <div class="wrapper">
        <div class="wrapper-container">
            <div class="panel">
                <div class="panel-body-sm">
                    <div class="row">
                        <div class="btn-group-sm" id="toolbar" role="group">
                            <a class="btn btn-primary" onclick="$.bttTable.bootstrapTreeTable('expandAll')">
                                <i class="fa fa-plus"></i> 全部展开
                            </a>
                            <a class="btn btn-success" onclick="$.bttTable.bootstrapTreeTable('collapseAll')">
                                <i class="fa fa-minus"></i> 全部折叠
                            </a>
                        </div>
                        <div class="col-sm-12 select-table table-striped">
                            <table id="bootstrap-tree-table"></table>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <script type="text/javascript" src="./../../../static/js/include/_include-js.js"></script>

    <script type="text/javascript">

        $(function () {
            var options = {
                code: "id",
                parentCode: "pid",
                uniqueId: "id",
                url: "./../../../static/data/treetable.json",
                type: 'get',
                modalName: "组织架构",
                showSearch: false,
                showRefresh: true,
                showColumns: true,
                columns: [{
                    field: 'selectItem',
                    radio: true
                },
                {
                    field: 'name',
                    title: '组织名称',
                    align: 'left'
                },
                {
                    field: 'orgType',
                    title: '组织类型'
                },
                {
                    field: 'createBy',
                    title: '创建者'
                },
                {
                    field: 'createTime',
                    title: '创建时间'
                },
                {
                    field: 'updateTime',
                    title: '更新时间'
                },
                {
                    field: 'sort',
                    title: '组织排序'
                },

                {
                    title: '操作',
                    align: 'center',
                    formatter: function (value, row, index) {
                        var actions = [];
                        actions.push('<a class="btn btn-primary btn-xs " href="javascript:void(0)" onclick=""><i class="fa fa-plus"></i>新增下级</a> ');
                        actions.push('<a class="btn btn-success btn-xs " href="javascript:void(0)" onclick=""><i class="fa fa-edit"></i>编辑</a> ');
                        actions.push('<a class="btn btn-danger btn-xs " href="javascript:void(0)" onclick=""><i class="fa fa-remove"></i>删除</a>');
                        return actions.join('');
                    }
                }]
            };
            $.treeTable.init(options);
        });
    </script>
</body>

</html>